<template>
	<view>
		<view class="person-head">
			<cmd-avatar src="/static/boylogo.png" @click="fnInfoWin" size="lg" :make="{ 'background-color': '#fff' }"></cmd-avatar>
			<view class="person-head-box">
				<view class="person-head-nickname">{{ realName }}</view>
				<view class="person-head-username">ID：{{ username }}</view>
			</view>
		</view>
		<view class="person-list">
			<cmd-cell-item title="个人信息" slot-left arrow><cmd-icon type="bullet-list" size="24" color="#0055ff"></cmd-icon></cmd-cell-item>
			<cmd-cell-item title="消息通知" slot-left arrow><cmd-icon type="message" size="24" color="#0055ff"></cmd-icon></cmd-cell-item>
			<cmd-cell-item title="系统设置" slot-left arrow><cmd-icon type="settings" size="24" color="#0055ff"></cmd-icon></cmd-cell-item>
			<!-- <cmd-cell-item title="检查版本" :addon="appVersion" @click="checkUpdata()" slot-left arrow>
				<cmd-icon type="alert-circle" size="24" color="#0055ff"></cmd-icon>
			</cmd-cell-item> -->
		</view>
		<view>
			<!-- 提示信息弹窗 -->
			<uni-popup ref="message" type="message"><uni-popup-message :type="msgType" :message="messageText" :duration="2000"></uni-popup-message></uni-popup>
		</view>
	</view>
</template>

<script>
import cmdAvatar from '@/components/cmd-avatar/cmd-avatar.vue';
import cmdIcon from '@/components/cmd-icon/cmd-icon.vue';
import cmdCellItem from '@/components/cmd-cell-item/cmd-cell-item.vue';
import checkappupdate from '@/utils/checkappupdate.js';

export default {
	components: {
		cmdAvatar,
		cmdCellItem,
		cmdIcon
	},
	data() {
		return {
			realName: '',
			username: '',
			appVersion: '',
			type: 'center',
			msgType: 'success',
			messageText: '这是一条成功提示',
			value: ''
		};
	},
	onShow(object) {
		let _this = this;
		uni.getStorage({
			key: 'userInfo',
			success(res) {
				// console.log(res)
				// console.log('获取成功',JSON.stringify(res));
				var userInfomsg = JSON.parse(JSON.stringify(res.data));
				console.log(userInfomsg);
				_this.realName = userInfomsg.realName;
				_this.username = userInfomsg.username;
				console.log(_this.realName);
			}
		});
		uni.getStorage({
			key: 'appVersion',
			success(res) {
				var versionmsg = JSON.parse(JSON.stringify(res.data));
				// console.log(res.data)
				// console.log(versionmsg)
				_this.appVersion = 'v' + versionmsg;
			}
		});
	},
	methods: {
		/**
		 * 打开用户信息页
		 */
		fnInfoWin() {
			uni.navigateTo({
				url: '/pages/user/info/info'
			});
		},
		/**
		 * 检查更新操作
		 */
		checkUpdata() {
			checkappupdate.check({
				title: '检测到有新版本！',
				content: '请升级app到最新版本！',
				canceltext: '暂不升级',
				oktext: '立即升级'
			});
			//无更新则提示当前使用的时最新版本
			this.msgType = 'success';
			this.messageText = `当前为最新版本，无需升级！`;
			this.$refs.message.open();
		}
	}
};
</script>

<style>
.person-head {
	display: flex;
	flex-direction: row;
	align-items: center;
	height: 150px;
	padding-left: 20px;
	background: linear-gradient(to right, #00aaff, #00ffff);
}

.person-head-box {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	margin-left: 10px;
}

.person-head-nickname {
	font-size: 18px;
	font-weight: 500;
	color: #fff;
}

.person-head-username {
	font-size: 14px;
	font-weight: 500;
	color: #fff;
}

.person-list {
	line-height: 0;
}
</style>
